<template>
    <view class="goods-index fullpage-min bg-f5">
        <view class="" style=" background: #fff;">
            <nav-bar hideBack :background="{'background':'#fff'}" :isFixed="false" titleWidth="700">
                <view slot="title" style="width: 100%;" class="flex-row jc-between color-6 ai-center">
                    <search-bar ref="searchBar" placeholderText="请输入商品名" style="width: 88%;" noPadding
                        @confirm="confirmSearch($event,2)">
                    </search-bar>
                    <view @click="confirmSearch($event,1)">
                        搜索
                    </view>
                </view>
            </nav-bar>
        </view>

        <u-gap height="20"></u-gap>
        <view class="goods-item flex-row  p-20 m-botoom-20 bg-ff size-24" v-for="(item,index) in 2" :key="index">
            <image src="../../static/goods/01.jpg" style="width: 190rpx;height: 190rpx;border-radius: 10rpx;" mode="">
            </image>
            <view class="m-left-20 flex-colum jc-between flex-2 line-height-48">
                <view class="name size-30 color-3 omit">
                    大白菜
                </view>
                <view class="quantity flex-row  flex-warp size-28 color-6 ">
                    <view class="m-right-10">
                        库存：10件
                    </view>
                    <view class="m-right-10">
                        月销量：200件
                    </view>
                    <view class="m-right-10">
                        月好评率：80%
                    </view>
                    <view class="m-right-10">
                        月报损率：20%
                    </view>
                </view>
                <view class="flex-row jc-between ai-center">
                    <view class="quantity size-24" style="color: #F82727;">
                        ￥<text class="size-36 font-bold">88</text>/￥23
                    </view>
                    <view class="btn-area text-right">
                        <g-button style="margin:  0 5px;" size="mini" type="primary">补货</g-button>
                        <g-button style="margin:  0 5px;" size="mini" type="primary">下架</g-button>
                        <!-- <g-button style="margin:  0 5px;" size="mini" type="primary">上架</g-button> -->
                        <g-button style="margin:  0 5px;" size="mini" type="primary" url="/pagesGoods/goods/detail">详情
                        </g-button>
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {

            }
        },
        methods: {
            confirmSearch(e, type) {
                if (type == 1) {
                    this.$refs.searchBar.confirm()
                }

                if (e.detail) {
                    return
                } else {
                    if ((e ?? '') !== '')
                        this.$store.dispatch('setGoodsHistory', e)
                }
                
                this.$refs.searchBar.clear()
            },
        }
    }
</script>

<style lang="scss" scoped>
</style>
